<template>
	<view class="team__meet_container flex-x">
		<view class="item12-5 flex-x left">
			<image :src="image" mode="aspectFit"></image>
			<text>{{name}}</text>
		</view>
		<view class="item12-7 flex-x right">
			<text v-if="number > 0" style="margin-right: 30rpx;">
				还差<span>{{number}}人</span>成团
			</text>
			
			<text v-else style="margin-right: 30rpx;">
				<span style="color:#F1C682">拼团成功</span>
			</text>
			
			<view v-show="number > 0" class="join__btn">去参团</view>
		</view>
	</view>
</template>

<script>
	export default {
		props: {
			image: String ,
			name: String ,
			number: String
		}
	}
</script>

<style>
	.team__meet_container {
		font-size: 24rpx;
		line-height: 36rpx;
		color: #999999;
		padding: 30rpx 0;
		border-bottom: 2rpx solid #CDCDCD;
	}
	
	.team__meet_container image{
		width: 56rpx;
		height: 56rpx;
		border-radius: 100%;
		margin-right: 20rpx;
	}
	
	.team__meet_container span{
		color: #AE7A1F;
	}
	
	.join__btn {
		color: #FFFFFF;
		padding: 12rpx 30rpx;
		background-color: #F37B1D;
		border-radius: 36rpx;
	}
</style>
